---
type: tutorial
title: Añadir un feed RSS
i18nReady: true
description: >-
  Tutorial: Crea tu primer blog con Astro —
  Instala el paquete oficial de Astro para crear un feed al que tus lectores puedan
  suscribirse
---
import Box from '~/components/tutorial/Box.astro';
import Checklist from '~/components/Checklist.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';



<PreCheck>
  - Instalar un paquete de Astro para crear un feed RSS para tu sitio web
  - Crear un feed que pueda ser suscrito y leído por lectores de RSS.
</PreCheck>

## Instala el paquete RSS de Astro

Astro ofrece un paquete personalizado para agregar rápidamente un feed RSS a tu sitio web.

Este paquete oficial genera un documento no HTML con información sobre todas las entradas de tu blog que puede ser leído por **lectores de feeds** como Feedly, The Old Reader, y más. Este documento se actualiza cada vez que se reconstruye tu sitio.

Las personas pueden suscribirse a tu feed en un lector de feeds y recibir una notificación cuando publiques una nueva entrada en tu sitio, lo que lo convierte en una función muy popular de los blogs.

1. Sal del servidor de desarrollo de Astro y ejecuta el siguiente comando en el terminal para instalar el paquete RSS de Astro.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npm install @astrojs/rss
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm add @astrojs/rss
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn add @astrojs/rss
      ```
      </Fragment>
    </PackageManagerTabs>

2. Reinicia el servidor de desarrollo para empezar a trabajar de nuevo en tu proyecto de Astro.

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npm run dev
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm run dev
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn run dev
      ```
      </Fragment>
    </PackageManagerTabs>

## Crea un documento de feed `.xml`

1. Crea un nuevo fichero en `src/pages/` llamado `rss.xml.js`.

2. Copia el siguiente código en este nuevo documento. Personaliza las propiedades `title` y `description` y si es necesario, especifica un idioma diferente en `customData`:

    ```js title="src/pages/rss.xml.js"

    import rss, { pagesGlobToRssItems } from '@astrojs/rss';

    export async function GET(context) {
      return rss({
        title: 'Alumno de Astro | Blog',
        description: 'Mi viaje de aprendizaje de Astro',
        site: context.site,
        items: await pagesGlobToRssItems(import.meta.glob('./**/*.md')),
        customData: `<language>en-us</language>`,
      });
    }
    ```

3. Agrega la propiedad  `site` al archivo de configuración de Astro con el URL único de tu sitio Netlify. 

```js title="astro.config.mjs" ins={4}
import { defineConfig } from "astro/config";

export default defineConfig({
  site: "https://example.com"
});
```
4. Este documento `rss.xml` sólo se crea cuando se construye tu sitio web, por lo que no podrás ver esta página en tu navegador durante el desarrollo. Cierra el servidor de desarrollo y ejecuta los siguientes comandos para, en primer lugar, construir tu sitio localmente y, a continuación, ver una vista previa de tu construcción:

    <PackageManagerTabs>
      <Fragment slot="npm">
      ```shell
      npm run build

      npm run preview
      ```
      </Fragment>
      <Fragment slot="pnpm">
      ```shell
      pnpm run build

      pnpm run preview
      ```
      </Fragment>
      <Fragment slot="yarn">
      ```shell
      yarn run build

      yarn run preview
      ```
      </Fragment>
    </PackageManagerTabs>

5. Visita `http://localhost:4321/rss.xml` y comprueba que puedes ver texto (sin formato) en la página con un `item` para cada uno de tus archivos `.md`. Cada elemento debe contener información sobre la entrada del blog, como `title`, `url` y `description`.

    :::tip[Ver tu feed RSS en un lector]
    Descarga un lector de feeds, o regístrate en un servicio de lector de feeds online y suscríbete a tu sitio añadiendo tu propia URL de Netlify. También puedes compartir este enlace con otras personas para que puedan suscribirse a tus entradas y recibir una notificación cuando se publique una nueva.
    :::

6. Asegúrate de salir de la vista previa y reiniciar el servidor de desarrollo cuando desees volver a ver tu sitio en modo de desarrollo.



<Box icon="check-list">

## Checklist

<Checklist>
- [ ] Puedo instalar un paquete de Astro utilizando la línea de comandos.
- [ ] Puedo crear un feed RSS para mi sitio web.
</Checklist>
</Box>

### Recursos

- [Generación de elementos RSS en Astro](/es/guides/rss/#usando-glob-imports)
